// box-sizing
.border-box {
  box-sizing: border-box;
}
.content-box {
  box-sizing: content-box;
}

// overflow-ellipsis
.overflow-ellipsis-2 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden; //溢出内容隐藏
  text-overflow: ellipsis; //文本溢出部分用省略号表示
  display: -webkit-box; //特别显示模式
  -webkit-line-clamp: 2; //行数
  line-clamp: 2;
  -webkit-box-orient: vertical; //盒子中内容竖直排列
}
.overflow-ellipsis-3 {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden; //溢出内容隐藏
  text-overflow: ellipsis; //文本溢出部分用省略号表示
  display: -webkit-box; //特别显示模式
  -webkit-line-clamp: 3; //行数
  line-clamp: 3;
  -webkit-box-orient: vertical; //盒子中内容竖直排列
}

// hover
.hover-scale {
  transition: all 0.2s;
  &:hover {
    transform: scale(1.25);
  }
}
.hover-pointer {
  &:hover {
    cursor: pointer;
  }
}
// 加深颜色
.hover-emphasis {
  &:hover {
    filter: brightness(0.9);
  }
}

// flex
.flex-1 {
  flex: 1;
}

.fs-0 {
  font-size: 0;
}

//
[class^="link-"],
.cursor-point {
  cursor: pointer;
}
.cursor-move {
  cursor: move;
}
.icon {
  width: 1em !important;
  height: 1em !important;
  line-height: 1 !important;
  display: inline-block !important;
  box-sizing: border-box !important;

  font-weight: 400;
  vertical-align: middle;
  font-variant: normal;
  text-transform: none;

  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

$rotates: (45, 90, 135, 180, 225, 270, 315, 360);

@each $rotate in $rotates {
  .rotate-#{$rotate} {
    transform: rotate(#{$rotate}deg);
  }
  .hover-emphasis {
    &:hover {
      filter: brightness(1.1);
    }
  }
}
